<template>
  <div>
    <el-menu
        :default-active="defaultActive"
        class="el-menu-vertical-demo"
        background-color="#545c64"
        text-color="#fff"
        active-text-color="#ffd04b"
        :router="true"
    >
      <el-menu-item index="/index">首页</el-menu-item>
      <template v-for="menu in menus">
        <el-submenu :index="menu.url" :key="menu.name">
          <template slot="title">{{ menu.name }}</template>
          <el-menu-item
              v-for="item in menu.children"
              :index="item.url"
              :key="item.name"
          >
            {{ item.name }}
          </el-menu-item>
        </el-submenu>
      </template>
    </el-menu>
  </div>
</template>

<script>
import {axiosGet} from "@/api";
export default {
  name: 'asideView',
  data() {
    return {
      menus: []
    }
  },
  mounted() {
    axiosGet("/menu/getMenu").then(resp => {
        this.menus = resp.data
    })
  }
}
</script>

<style>

</style>
